<template>
	<div>
		<header class="aui-header">
			<a class="aui-pull-left aui-btn" @click="returnback">
				<!--<span class="aui-iconfont aui-icon-left"></span>-->
				<img src="../assets/rightbut.png">
			</a>
			<div class="aui-title">收货地址</div>
		</header>
		<div class="receaddressmain">
			<ul class="receaddress-ul">
				<li class="receaddress-li" v-for="(item,index) in addresslist">
					<div @click="hui(item.id,item.receiverName,item.receiverPhone,item.city)">
						
						<div class="samerecide">
						<span class="username">{{item.receiverName}}</span>
						<span class="userphone">{{item.receiverPhone}}</span>
					</div>
					<div class="addressname">{{item.city}}{{item.detail}}</div>
						
					</div>
					<div class="addressedit">
						<div class="defalutaddress" @click="tacitly(item.id)"><input :checked='1' type="checkbox" class="cheboxsty" v-if="item.isDefaultAddress == '1'">
						<input :checked='0' type="checkbox" class="cheboxsty" v-if="item.isDefaultAddress == '0'"> 默认地址</div>
						<div class="editaddress" @click="deladdress(item.id,index)"><i class="samepic delimg"></i>删除</div>
						<div class="editaddress" @click="editaddressbut(item.id,item.receiverName,item.receiverPhone,item.city,item.detail)"><i class="samepic editimg"></i>编辑</div>
					</div>
				</li>
			</ul>
		</div>
		<div class="addressfooter">
			<router-link to="/newaddress" class="addaddressbut">添加新地址</router-link>
		</div>
	</div>
</template>

<script>
	import { BaseUrl } from '../Baseurl/common.js';
	export default {
		data() {
			return {
				addresslist:[],
				token:'',
				skuIdCounts:''
			}
		},
		created(){
			var href = window.location.href;
		},
		methods: {
			editaddressbut:function(obj,name,phone,city,detail){
//				alert(obj);
				var url = 'addrId='+obj+'&name='+encodeURI(name)+'&phone='+phone+'&city='+encodeURI(city)+'&detail='+encodeURI(detail);
//				alert(url);
				this.$router.push({ path:'/editaddress?'+url})
			
			},
			deladdress:function(obj, index){
				this.addresslist.splice(index, 1);
				var url = BaseUrl+'users/address/del?addrId=' + obj;
				this.$http.get(url).then(res => {
					
					if(res.data.code == "10000"){
						Toast({
							message: "删除成功！",
							position: 'middle',
							duration: 3000
						});
					}else{
						Toast({
							message: res.data.msg,
							position: 'middle',
							duration: 3000
						});
					}
				})
			},
			returnback:function(){
//				this.$router.go(-1);
				this.$router.push({
					path: '/pay?skuIdCounts='+localStorage.getItem('skuIdCounts')
				})
			},
			hui:function(id,receiverName,receiverPhone,city){
				localStorage.setItem('receiverName', receiverName);
				localStorage.setItem('receiverPhone', receiverPhone);
				localStorage.setItem('city', city);
				this.$router.push({
					path: '/pay?skuIdCounts='+localStorage.getItem('skuIdCounts')+ '&id='+id
				})
			},
			tacitly:function(id){
				
				this.token = localStorage.getItem('token');
				var url = BaseUrl +'users/address/addDefaultAddr?appId=gzh'+"&token="+ this.token+ "&addrId="+id
				this.$http.get(url).then(res=>{
//					console.log(res)
					if(res.data.code == '10000'){
						var url = BaseUrl+'users/address/addrlist?token='+this.token+'&appId=gzh';
						this.$http.get(url).then(res => {
							this.addresslist = res.data.data;
//							console.log(res.data.data);
						})
					}
				})
				
			}
		},
		created() {
			this.token = localStorage.getItem('token');
			var url = BaseUrl+'users/address/addrlist?token='+this.token+'&appId=gzh';
			this.$http.get(url).then(res => {
				this.addresslist = res.data.data;
//				console.log(res.data.data);
			})
		}
	}
</script>

<style scoped="scoped">
	.receaddressmain {
		margin-top: 1rem;
	}
	
	.receaddress-ul {
		width: 100%;
		
	}
	
	.receaddress-li {
		padding: 0.2rem 0.25rem;
		display: block;
		background-color: #FFFFFF;
		margin-top: 0.2rem;
	}
	/******名字加手机号******/
	
	.samerecide {
		height: 0.38rem;
		line-height: 0.38rem;
		font-size: 0.24rem;
		color: #323232;
	}
	
	.username {
		display: inline-block;
	}
	
	.userphone {
		display: inline-block;
		float: right;
	}
	
	.addressname {
		color: #323232;
		font-size: 0.24rem;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		line-height: 0.4rem;
		margin-top: 0.1rem;
	}
	
	.addressedit {
		border-top: solid 0.01rem #CCCCCC;
		margin-top: 0.24rem;
	}
	
	.defalutaddress {
		display: inline-block;
	    margin-top: 0.2rem;
	}
	
	.cheboxsty {
		width: 0.22rem;
		height: 0.22rem;
	}
	
	.editaddress {
		display: inline-block;
		float: right;
	    margin-top: 0.2rem;
	}
	.editaddress:nth-child(2){
		margin-left: 0.2rem;
	}
	.samepic {
		width: 0.28rem;
		height: 0.3rem;
		display: inline-block;
	    margin-right: 0.05rem;
        margin-top: 0.05rem;
	}
	.editimg{
		background: url(../assets/porlife_icon_bj.png);
		background-size: 100%;
	}
	.delimg{
		background: url(../assets/porlife_btn_sc.png);
		background-size: 100%;
	}
	.addressfooter{
		width: 100%;
		height: 0.8rem;
		position: fixed;
		bottom: 0.2rem;
	}
	.addaddressbut{
		width: 93%;
		height: 0.8rem;
		background-color: #FF2040;
		margin: 0 auto;
		border-radius: 0.4rem;
		line-height: 0.8rem;
		color: #FFFFFF;
		font-size: 0.28rem;
		text-align: center;
		display: block;
	}
</style>